@charset "gb2312";
@media screen and (min-width: 1024px) and (max-width: 1199px) {
  .menu{display: none}
header { width: 100%; margin: auto; }
.nav { width: 90% }
.nav li a { padding: 0 15px }
.search_bar { display: none }
article { width: 90%; margin: 100px auto 0 }
 .blogcontainer {width: 95%;}
 .detailcontainer{ width: 90%; margin: 15px auto 0;}
 .v-note-navigation-wrapper{display: none !important;}
 .BlogAnchor{display: none !important;}
.fader { padding-top: 0; height: 360px }
.imginfo { bottom: 15% }
.toppic li i img { height: 170px; }
.gd { width: 230px }
.container { width: 90%; margin: 20px auto; }
.share ul li i { }
 .side-toolbar .github{
   display: none;
 }
    footer{display: none}
}
@media screen and (min-width: 960px) and (max-width: 1023px) {
  .menu{display: none}
header { width: 100%; margin: auto; }
.nav { width: 90% }
.nav li a { padding: 0 15px }
.search_bar { display: none }
  .inner {
    width: auto;
    margin: 2rem auto;
  }
  .news_title {
    font-size: 3.3rem;
    letter-spacing: -1px;
  }
article { width: 90%; margin: 100px auto 0 }
 .detailcontainer{ width: 90%; margin: 15px auto 0;}
 .BlogAnchor{display: none !important;}
 .blogcontainer {width: 95%;}
 .v-note-navigation-wrapper{display: none !important;}
.fader { padding-top: 0; height: 337px }
.imginfo { bottom: 15% }
.toppic li i img { height: 160px; }
.gd { width: 220px }
.zhuanti p { top: 20% }
.container { width: 90%; margin: 20px auto; }
.share ul li i { }
.timebox li:hover a { padding: 0 30px }
 .side-toolbar .github{
   display: none;
 }
    footer{display: none}
}
/*iPad Mini  screen-width:768px*/
@media screen and (min-width: 768px) and (max-width: 959px) {
  .menu{display: none}
header, .blogsbox { width: 100%; margin: auto; }
.menu { width: 90%; display: none; }
#mnav { display: block; z-index: 99999;  }
.search_bar { display: none }
article { width: 90%; margin: 70px auto 0 }
 .detailcontainer{ width: 90%; margin: 15px auto 0;}
 .BlogAnchor{display: none !important;}
 .v-note-navigation-wrapper{display: none !important;}
.imginfo { bottom: 17% }
.fader { padding-top: 0; height: 279px }
.toppic li i img { height: 130px; }
.sidebar { display: none }
.imginfo { font-size: 22px }
.news_infos { width: 100% }
.container { width: 90%; margin: 20px auto; }
.shareli { margin: 0 5px; }
.share ul li i { height: 150px }
.share ul li h2 { padding: 15px 5px; }
h1.t_nav span { display: none }
.timebox li { font-size: 15px }
.timebox li span { margin-right: 30px }
.timebox:before { left: 100px; }
.timebox li a:after { left: -26px }
.timebox li:hover a { padding: 0 30px }
.infosbox { width: 100% }
.pagebg {margin-top: 50px;}
 .el-carousel__container{height: 268px !important;}
 .side-toolbar .github{
   display: none;
 }
    footer{display: none}
}
/*iphone 6,7,8plus screen-width:414px */
@media only screen and (min-width: 414px) and (max-width: 736px) {
header, .blogsbox, .banner { width: 100%; margin: auto; }
.menu { width: 90%; display: none !important;color: red }
#mnav { display: block; z-index: 99999; }
.search_bar, .toppic { display: none }
  .inner {
    width: auto;
    margin: 0 auto;
  }
article { width: 90%; margin: 70px auto 0 }
  .news_title {
    font-size: 1.4rem;
    margin-top: 15px;
  }
  .article-info-text>.postMeta {
    font-size: 10px;
  }
 .detailcontainer{ width: 90%; margin: 15px auto 0;}
 .BlogAnchor{display: none !important;}
 .v-note-navigation-wrapper{display: none !important;}
.bloginfo { width: 100%; clear: both }
.blogs .blogpic { width: 30%; height: auto }
.fader { padding-top: 50%; width: 100% }
.imginfo { font-size: 20px; bottom: 20%; }
.bloginfo ul li { margin-right: 10px }
.bplist li img { height: 100px }
.bplist li { height: 100px }
.bigpic img { height: auto }
.blogs .blogtext { margin-top: 10px; }
.bplist li:nth-child(2) { margin-left: 3px; }
.sidebar { display: none }
.news_infos { width: 100% }
h1.t_nav span { display: none }
.container { width: 90%; margin: 20px auto; }
.share ul li { width: 50% }
.share ul li i { height: 150px }
.shareli { margin: 0 15px; }
.share ul li h2 { padding: 15px 15px; }
.timebox li { font-size: 15px }
.timebox li span { display: none }
.timebox:before { display: none }
.timebox li:hover a { padding: 0 30px }
.infosbox { width: 100% }
.pagebg {margin-top: 50px;}
.diggit{ float:none; margin-left: auto;}
.dasbox{ display:none}
 .el-carousel__container{height: 150px !important;}
  .page-title{ font-size: 1rem !important;}
  .main-header{height: 40vh !important;}
  .page-description{font-size: 1rem !important;}
 .blogcontainer {width: 95%;}
 .warmer-section {
  height: 135px !important;
 }
 .githubflag{
  display: none;
 }
 .side-toolbar .github{
  display: block;
 }
    footer{display: none}
}

/*iphone X screen-width:375px, screen-hight: 812px */
@media only screen and (min-width: 375px) and (max-width: 812px) {
 header, .blogsbox, .banner { width: 100%; margin: auto; }
  .news_title {
    font-size: 1.4rem;
    margin-top: 15px;
  }
  .article-info-text>.postMeta {
    font-size: 10px;
  }
 .menu { width: 90%; display: none; }
 #mnav { display: block; z-index: 99999; }
 .search_bar, .toppic { display: none }
 article { width: 90%; margin: 70px auto 0 }
  .inner {
    width: auto;
    margin: 0 auto;
  }
 .detailcontainer{ width: 90%; margin: 15px auto 0;}
 .BlogAnchor{display: none !important;}
 .v-note-navigation-wrapper{display: none !important;}
 .bloginfo { width: 100%; clear: both }
 .blogs .blogpic { width: 30%; height: auto }
 .fader { padding-top: 50%; width: 100% }
 .imginfo { font-size: 20px; bottom: 20%; }
 .bloginfo ul li { margin-right: 10px }
 .bplist li img { height: 100px }
 .bplist li { height: 100px }
 .bigpic img { height: auto }
 .blogs .blogtext { margin-top: 10px; }
 .bplist li:nth-child(2) { margin-left: 3px; }
 .sidebar { display: none }
 .news_infos { width: 100% }
 h1.t_nav span { display: none }
 .container { width: 90%; margin: 20px auto; }
 .share ul li { width: 50% }
 .share ul li i { height: 150px }
 .shareli { margin: 0 15px; }
 .share ul li h2 { padding: 15px 15px; }
 .timebox li { font-size: 15px }
 .timebox li span { display: none }
 .timebox:before { display: none }
 .timebox li:hover a { padding: 0 30px }
 .infosbox { width: 100% }
 .pagebg {margin-top: 50px;}
 .diggit{ float:none; margin-left: auto;}
 .dasbox{ display:none}
 .el-carousel__container{height: 240px !important;}
  .page-title{ font-size: 1rem !important;}
  .main-header{height: 40vh !important;}
  .page-description{font-size: 1rem !important;}
 .blogcontainer {width: 95%;}
 .warmer-section {
  height: 135px !important;
 }
 .githubflag{
  display: none;
 }
 .side-toolbar .github{
  display: block;
 }
    footer{display: none}
}
@media only screen and  (min-width: 376px) and (max-width: 413px) {
 header, .blogsbox, .banner { width: 100%; margin: auto; }
 .menu { width: 90%; display: none; }
 #mnav { display: block; z-index: 99999;  }
 .search_bar, .toppic { display: none }
 article { width: 90%; margin: 70px auto 0 }
 .detailcontainer{ width: 90%; margin: 15px auto 0;}
 .BlogAnchor{display: none !important;}
 .v-note-navigation-wrapper{display: none !important;}
 .imginfo { font-size: 18px; bottom: 22%; }
 .bloginfo { width: 100%; clear: both; }
 .blogs .blogpic { width: 100%; height: auto; margin-bottom: 10px }
 .fader { padding-top: 60%; width: 100% }
 .bloginfo ul li { margin-right: 10px }
 .bplist li img { height: 100px }
 .bplist li { height: 100px }
 .bigpic img { height: auto }
 .blogs .blogtext { width: 100%; }
 .bloginfo ul li { background-image: none }
 .bloginfo .author, .bloginfo .lmname { display: none }
 .bplist li:nth-child(2) { margin: 0 0 0 2px }
 .sidebar { display: none }
 .news_infos { width: 100% }
 h1.t_nav span { display: none }
 .container { width: 90%; margin: 20px auto; }
 .share ul li { width: 50% }
 .share ul li i { height: 150px }
 .shareli { margin: 0 3%; }
 .share ul li h2 { padding: 15px 15px; }
 footer p { padding: 0 30px }
 .timebox li { font-size: 15px }
 .timebox li span { display: none }
 .timebox:before { display: none }
 .timebox li:hover a { padding: 0 30px }
 .infosbox { width: 100% }
 .pagebg {margin-top: 50px;}
 .diggit{ float:none; margin-left: auto;}
 .dasbox{ display:none}
 .el-carousel__container{height: 158px !important;}
  .el-carousel__container{height: 240px !important;}
  .page-title{ font-size: 1rem !important;}
  .main-header{height: 40vh !important;}
  .page-description{font-size: 1rem !important;}
 .detailcontainer{ width: 90%; margin: 15px auto 0;}
 .blogcontainer {width: 90%;}
 .sidebardetail{display: none}
 .comment-list .new-comment textarea {
  width: calc(70vw)!important;
 }
 .warmer-section {
  height: 135px !important;
 }
 .githubflag{
  display: none;
 }
 .side-toolbar .github{
  display: block;
 }
    footer{display: none}
}
/*Galaxy S5  screen-width:360px*/
@media only screen and  (min-width: 360px) and (max-width: 375px) {
header, .blogsbox, .banner { width: 100%; margin: auto; }
.menu { width: 90%; display: none; }
#mnav { display: block; z-index: 99999;  }
.search_bar, .toppic { display: none }
article { width: 90%; margin: 70px auto 0 }
 .detailcontainer{ width: 90%; margin: 15px auto 0;}
 .BlogAnchor{display: none !important;}
 .v-note-navigation-wrapper{display: none !important;}
.imginfo { font-size: 18px; bottom: 22%; }
.bloginfo { width: 100%; clear: both; }
.blogs .blogpic { width: 100%; height: auto; margin-bottom: 10px }
.fader { padding-top: 60%; width: 100% }
.bloginfo ul li { margin-right: 10px }
.bplist li img { height: 100px }
.bplist li { height: 100px }
.bigpic img { height: auto }
.blogs .blogtext { width: 100%; }
.bloginfo ul li { background-image: none }
.bloginfo .author, .bloginfo .lmname { display: none }
.bplist li:nth-child(2) { margin: 0 0 0 2px }
.sidebar { display: none }
.news_infos { width: 100% }
h1.t_nav span { display: none }
.container { width: 90%; margin: 20px auto; }
.share ul li { width: 50% }
.share ul li i { height: 150px }
.shareli { margin: 0 3%; }
.share ul li h2 { padding: 15px 15px; }
footer{display: none}
footer p { padding: 0 30px;display: none }
.timebox li { font-size: 15px }
.timebox li span { display: none }
.timebox:before { display: none }
.timebox li:hover a { padding: 0 30px }
.infosbox { width: 100% }
.pagebg {margin-top: 50px;}
.diggit{ float:none; margin-left: auto;}
.dasbox{ display:none}
.el-carousel__container{height: 220px !important;}
  .page-title{ font-size: 1rem !important;}
  .main-header{height: 40vh !important;}
  .page-description{font-size: 0.8rem !important;}
 .blogcontainer {width: 90%;}
 .sidebardetail{display: none}
 .comment-list .new-comment textarea {
  width: calc(70vw)!important;
 }
 .warmer-section {
  height: 135px !important;
 }
 .githubflag{
  display: none;
 }
 .side-toolbar .github{
  display: block;
 }
}
/*iphone 6  screen-width:375px*/
/*
@media only screen and (min-width: 375px) and (max-width: 414px) {

}*/
@media only screen and (max-width: 360px) {
 header, .blogsbox, .banner { width: 100%; margin: auto; }
 .menu { width: 90%; display: none; }
 #mnav { display: block; z-index: 99999;  }
 .search_bar, .toppic { display: none }
 article { width: 90%; margin: 70px auto 0 }
 .detailcontainer{ width: 90%; margin: 15px auto 0;}
 .BlogAnchor{display: none !important;}
 .v-note-navigation-wrapper{display: none !important;}
 .imginfo { font-size: 18px; bottom: 22%; }
 .bloginfo { width: 100%; clear: both; }
 .blogs .blogpic { width: 100%; height: auto; margin-bottom: 10px }
 .fader { padding-top: 60%; width: 100% }
 .bloginfo ul li { margin-right: 10px }
 .bplist li img { height: 100px }
 .bplist li { height: 100px }
 .bigpic img { height: auto }
 .blogs .blogtext { width: 100%; }
 .bloginfo ul li { background-image: none }
 .bloginfo .author, .bloginfo .lmname { display: none }
 .bplist li:nth-child(2) { margin: 0 0 0 2px }
 .sidebar { display: none }
 .news_infos { width: 100% }
 h1.t_nav span { display: none }
 .container { width: 90%; margin: 20px auto; }
 .share ul li { width: 50% }
 .share ul li i { height: 150px }
 .shareli { margin: 0 3%; }
 .share ul li h2 { padding: 15px 15px; }
 footer p { padding: 0 30px }
 .timebox li { font-size: 15px }
 .timebox li span { display: none }
 .timebox:before { display: none }
 .timebox li:hover a { padding: 0 30px }
 .infosbox { width: 100% }
 .pagebg {margin-top: 50px;}
 .diggit{ float:none; margin-left: auto;}
 .dasbox{ display:none}
 .el-carousel__container{height: 186px !important;}
  .page-title{ font-size: 1rem !important;}
  .main-header{height: 40vh !important;}
  .page-description{font-size: 0.8rem !important;}
 .blogcontainer {width: 90%;}
 .sidebardetail{display: none}
 .comment-list .new-comment textarea {
   width: calc(70vw) !important;
 }
 .editormd-preview-container, .editormd-html-preview {
   padding: 0px !important;
 }
 .warmer-section {
   height: 135px !important;
 }
 .githubflag{
    display: none;
 }
 .side-toolbar .github{
  display: block;
 }
    footer{display: none}
}
